import React, { useState } from 'react';
import { Modal, Icon, Button, message } from 'antd';

const ArticleWagesModal = ({ modalVisible, dispatch, dispatchType, msg, power }) => {
    //  弹窗=》确定按钮是否加载状态
    const [confirmLoad, setConfirmLoad] = useState(false);

    const onRejectOk = () => {
        setConfirmLoad(true);
        dispatch({
            type: dispatchType.updateDataType,
            callback: response => {
                const { code, msg: resMsg } = response
                if (code === 10000) {
                    setConfirmLoad(false);
                    message.success(resMsg)
                    dispatch({
                        type: 'articleWagesModel/closeModal'
                    });
                }
            }
        });
    };

    const onRejectClose = () => {
        dispatch({
            type: 'articleWagesModel/closeModal'
        });
    };

    const title = '提示';

    return (
        <Modal
            title={title}
            visible={modalVisible}
            onOk={onRejectOk}
            cancelText={null}
            onCancel={onRejectClose}
            destroyOnClose
            centered
            confirmLoading={confirmLoad}
            footer={
                power
                    ? [
                        <Button key="back" onClick={onRejectClose}>
                            取消生成
                        </Button>,
                        <Button key="submit" type="primary" loading={confirmLoad} onClick={onRejectOk}>
                            重新生成
                        </Button>
                      ]
                    : [
                        <Button key="back" type="primary" onClick={onRejectClose}>
                            知道了
                        </Button>
                      ]
            }
        >
            <Icon type="exclamation-circle" style={{ fontSize: 16, color: '#FFA22D', marginRight: 5 }} />
            {msg}
        </Modal>
    );
};

export default ArticleWagesModal;
